//
//  HTPremiumRegularGuide.swift
//  MagaCore
//
//  Created by MrMessy on 2023/5/23.
//

import SwiftUI
import SDWebImageSwiftUI

struct HTPremiumRegularGuide: View {

  @Binding var var_adConfig: HTAdConfig?
  @Binding var var_introductorySub: HTSubscribe?
  @State var var_onClose: (() -> Void)? = {}
  @State var var_onChooseMore: (() -> Void)? = {}
  @State var var_onPaySubscribe: ((HTSubscribe) -> Void)? = {sub in}

  var body: some View {
    ZStack(alignment: .topTrailing){
      ZStack(alignment: .topTrailing){
        ScrollView(showsIndicators: false){
          VStack(spacing: 0){
            WebImage(url: URL(string: var_adConfig!.ht_regularSubImg()))
              .resizable()
              .aspectRatio(contentMode: .fit)
              .frame(width: UIDevice.ht_screenWidth())
            Text(var_adConfig!.ht_regularSubTitle())
              .foregroundColor(Color.black)
              .font(.system(size: 22))
              .fontWeight(.bold)
              .padding(.top, 10)
            Text("Watch full animes without sharing")
              .foregroundColor(Color(hex: "#999999"))
              .font(.system(size: 12))
              .padding(.top, 10)
            ZStack(alignment: .trailing){
              HStack{
                Text("$\(var_introductorySub?.var_introductoryPrice ?? 0)/\(var_introductorySub?.var_title ?? "")")
                  .font(.system(size: 14))
                  .foregroundColor(Color(hex: "#665136"))
                  .fontWeight(.medium)
              }
              .frame(maxWidth: .infinity, maxHeight: .infinity)
              Text("-\(var_introductorySub?.ht_discountPercentage() ?? "")")
                .font(.system(size: 10))
                .foregroundColor(Color.white)
                .frame(width: 45, height: 20)
                .background(LinearGradient(colors: [Color(hex: "#FF5840"), Color(hex: "#FF8338")], startPoint: .leading, endPoint: .trailing))
                .cornerRadius(2)
                .padding(.trailing, 15)
            }
            .frame(width: 288, height: 50, alignment: .trailing)
            .background(LinearGradient(colors: [Color(hex: "#EDC391"), Color(hex: "#FDDDB7")], startPoint: .leading, endPoint: .trailing))
            .cornerRadius(6)
            .padding(.top, 30)
            .onTapGesture {
              var_onPaySubscribe!(var_introductorySub!)
            }
            Text("You can acncel anytime")
              .foregroundColor(Color(hex: "#999999"))
              .font(.system(size: 12))
              .padding(.top, 8)
            HStack{
              Text("Choose more plans")
                .underline()
                .foregroundColor(Color.black)
                .font(.system(size: 12))
                .padding(.top, 75)
            }
            .onTapGesture {
              var_onChooseMore!()
            }
          }
          .frame(maxWidth: .infinity, maxHeight: .infinity)
        }
        .frame(maxWidth: .infinity, maxHeight: .infinity)

        HStack{
          Image("close_guide")
            .frame(width: 14, height: 14)
            .padding(20)
        }
        .frame(alignment: .topTrailing)
        .onTapGesture {
          var_onClose!()
        }
      }
      .padding(.top, UIDevice.ht_statusBarHeight())
      .frame(maxWidth: .infinity, maxHeight: .infinity)
    }
    .background(Color.white)
    .frame(maxWidth: .infinity, maxHeight: .infinity)
  }
}
